define([
	'jquery',
	'underscore',
	'backbone',
	'fileuploader',
	'catjs/util',
	'jRating',
	],function($,_,Backbone,uploader,util){

	var module = {};

	var WIDTH = window.innerWidth;
	var HEIGHT = window.innerHeight;

	var CanteenView = Backbone.View.extend({

		el : $('#can-building'),
		left : $('#can-building .restaurant-left-floor'),
		mid : $('#can-building .restaurant-mid-floor'),
		right : $('#can-building .restaurant-right-floor'),
		all : $('#can-building .restaurant-left-floor,#can-building .restaurant-mid-floor,#can-building .restaurant-right-floor'),
		events : {
			//中间房间
			'click .restaurant-mid-right' : 'toRight',
			'click .restaurant-mid-left' : 'toLeft',
			'click .restaurant-mid-down' : 'leave',
			'click .restaurant-mid-post' : 'rank',
			//左边房间
			'click .restaurant-left-right' : 'left2mid',
			'click .restaurant-left-post' : 'recommend',
			//右边房间
			'click .restaurant-right-left' : 'right2mid',
			'click .restaurant-right-post' : 'message',
		},

		init : function(){
			var self = this;
			self.left.css('left',-WIDTH);
			self.mid.css('left',0);
			self.right.css('left',+WIDTH);
		},
		render : function(){
			var self = this;
			self.init();

			self.GetMsgList({buildingId:self.can_id},function(json){
				var messages = JSON.parse(json);
				self.$el.find('.restaurant-mid-ul').html(
					util.ejs.render($('#tplCanMidLi').text(),{messages:messages})
				);
				self.$el.fadeIn();
			});
		},	
		//移动
		//留言区
		toRight : function(){
			var self = this;
			self.GetMsgList({buildingId:self.can_id},function(json){
				var messages = JSON.parse(json);
				self.$el.find('.restaurant-right-ul').html(
					util.ejs.render($('#tplCanRightLi').text(),{messages:messages})
				);
				self.scrollRight();
			});
		},
		//美食推荐区
		toLeft : function(){
			var self = this;
			self.GetRecommendList({buildingId:self.can_id},function(json){
				var recommends = JSON.parse(json);
				self.$el.find('.restaurant-left-ul').html(
					util.ejs.render(
						$('#tplCanLeftLi').text(),{recommends:recommends}
					)
				);
				self.scrollLeft();
			});
		},
		left2mid : function(){
			var self = this;
			self.scrollRight();
		},
		right2mid : function(){
			var self = this;
			self.scrollLeft();
		},
		//向左边移动
		scrollLeft : function(){
			var self = this;
			self.all.animate({
				'left' : '+='+WIDTH,
			},1000,'swing');
		},
		//向右边移动
		scrollRight : function(){
			var self = this;
			self.all.animate({
				'left' : '-='+WIDTH,
			},1000,'swing');
		},
		//推荐美食
		recommend : function(){
			var self = this;
			$('#dialog2 .dialog1-hd').html('美食推荐');
			$('#dialog2 .dialog1-wrap').css({
				'width' : 450,
			});
			$('#dialog2 .dialog1-bd').html($('#tplRecommend').text());	
			$('#dialog2').fadeIn();
			var user = util.getUser();
			//推荐是否已经上传
			var uploaded = false;
			var recommend;
			//美食推荐图片上传
			new uploader.FileUploader({
				element: $('#dialog2 .recommend-pic')[0],
				action: '/Canteen/AddRecommend',
				allowedExtensions: ['jpg', 'jpeg', 'png', 'gif'],
				params : {
					userId : user.userId,
					buildingId : self.can_id,
					contents : '',
				},
				debug: true,
				onComplete : function(id,fileName,json){
					$('#dialog2 .recommend-pic').html('上传成功');
					uploaded = true;
					recommend = json;
				},
			});
			$('#dialog2 .recommend').click(function(){
				recommend.contents = $('#dialog2 .recommand-content').val();
				$.ajax({
					url : '/Canteen/Updaterecommend',
					type : 'PUT',
					data : {
						recommendId : recommend.recommendId,
						contents : recommend.contents,
						picture : recommend.picture,
					},
					success : function(json){
						self.$el.find('.restaurant-left-ul').prepend(
							util.ejs.render($('#tplCanLeftLi').text(),{recommends:[recommend]})
						);
						$('#dialog2').fadeOut();
					},
				});
			});
		},
		//留言
		message : function(){
			var self = this;
			$('#dialog2 .dialog1-wrap').css({
				'width' : 450,
			});
			$('#dialog2 .dialog1-hd').html('留言');
			$('#dialog2 .dialog1-bd').html($('#tplMessage').text());
			$('#dialog2 .message').click(function(){
				var data = {
					userId : util.getUser().userId,
					buildingId : self.can_id,
					content : $('#dialog2 .message-content').val(),
				};
				self.AddMsg(data,function(json){
					var message = JSON.parse(json);
					self.$el.find('.restaurant-right-ul').prepend(
						util.ejs.render($('#tplCanRightLi').text(),{messages:[message]})
					);
					$('#dialog2').fadeOut();
				});
			});
			$('#dialog2').fadeIn();
		},
		//离开食堂
		leave : function(){
			var self = this;
			self.$el.fadeOut();
		},
		//评分
		rank : function(){
			$('#dialog1 .dialog1-bd').html($('#tplRank').text());
			$('#dialog1 .dialog1-wrap').css({
				'width' : 300,
				'top' : 200,
			});
			$('#rating').jRating({
				step:true,
				length : 5,
				bigStarsPath : '/static/img/stars.png',
			});
			$('#dialog1').fadeIn();
		},
		//留言列表
		GetMsgList : function(data,callback){
			var self = this;
			self.ajax('/Canteen/GetMsgList','GET',data,callback);
		},
		//增加留言
		AddMsg: function(data,callback){
			var self = this;
			self.ajax('/Canteen/AddMsg','POST',data,callback);
		},
		//推荐列表
		GetRecommendList : function(data,callback){
			var self = this;
			self.ajax('/Canteen/GetRecommendList','GET',data,callback);
		},
		//communicate with server
		ajax : function(url,type,data,callback){
			$.ajax({
				url : url,
				type : type,
				data : data,
				success : function(json){
					callback !== undefined ? callback(json) : 0;
				},
			});
		},
	});
	var canteen = new CanteenView;


	module.enter = function(can_id){
		canteen.can_id = can_id;
		canteen.render();
	};
	
	return module;
});